let lis = document.querySelectorAll('li')
let as = document.querySelectorAll('li > a')
lis.forEach(function(li,i){
    li.addEventListener('mouseenter',function(){
        
        li.style.background = 'blue'
        if(as[i].nextElementSibling){
            as[i].nextElementSibling.style.height = '120px'
        }
    })
    li.addEventListener('mouseleave',function(){
        
        li.style.background = 'red'
        if(as[i].nextElementSibling){
            as[i].nextElementSibling.style.height = ''
        }
    })
})